<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Make an order</title>
	</head>
	<script type="text/javascript">
		dojo.require("dojo.date.locale");	
	</script>
	<script type="text/javascript">
		dojo.addOnLoad( function( ) {
			availableStore = new dojo.data.ItemFileWriteStore( 
				{ url: "/FinalProject/app/ordersManagement?ordersOp=order_get_slots&instrumentId="+dijit.byId( "instrumentsGrid").selection.getSelected()[0].id[0], 
				  clearOnClose: true, 
				  jsId:"rolesStore"  } );
			userProjectsStore = new dojo.data.ItemFileWriteStore( 
					{ url: "/FinalProject/app/projectManagement?projectOp=project_user_projects", 
					  clearOnClose: true, 
					  jsId:"rolesStore"  } );
			  
		});
	</script>
	<body>
		<form>
			<fieldset>
				<table width="100%">
					<tr>
						<td align="left">
							<label>
								Order date:
							</label>	
						</td>
						<td align="right">
							<input dojoType="dijit.form.DateTextBox" id="selectDate" name="date" />
						</td>
					</tr>
					<tr>
						<td>
							<label>
								Select project:
							</label>
						</td>
						<td>
							<select dojoType="dijit.form.ComboBox" name="startSlot" id="selectProject" store="userProjectsStore" searchAttr="projectName">
							</select>
						</td>
					</tr>
					<tr>	
						<td align="left">
							<label>
								Select available start slot:
							</label>
						</td>
						<td align="right">
							<select dojoType="dijit.form.ComboBox" name="startSlot" id="selectStartSlot" store="availableStore" searchAttr="timeSlot">
							</select>
						</td>
					</tr>
					<tr>
						<td align="left">
							<label>
								Enter slots count for reservation:
							</label>
						</td>
						<td align="right">
							<input dojoType="dijit.form.ValidationTextBox" name="slotsCount" id="selectSlotsCount" required="true" promptMessage="Enter slots count." invalidMessage="Slots count is required." regExp="(\d)*" />
						</td>
					</tr>
					<tr>
						<td colspan=2 align="right">
							<button dojoType="dijit.form.Button">
								Cancel
								<script event="onClick" args="event" type="dojo/method">
									dijit.byId( "orderDialog").destroyRecursive( );
								</script>
							</button>
							<button dojoType="dijit.form.Button">
								Save
								<script event="onClick" args="event" type="dojo/method">
									if ( !dijit.byId( "selectDate") || !dijit.byId( "selectSlotsCount") ||
										 !dijit.byId( "selectProject") || !dijit.byId( "selectStartSlot") ||
										 dijit.byId( "selectStartSlot").value.length == 0 ||
										 dijit.byId( "selectDate").value.length == 0 ||
										 dijit.byId( "selectSlotsCount").value.length == 0 ||
										 dijit.byId( "selectProject").value.length == 0 ) {

  										dijit.byId( "toaster").setContent( "You need to fill all fields.", "fatal");
										dijit.byId( "toaster").show( );
										return;
									}
									dojo.xhrPost( {
										handleAs : "json",
										url: "/FinalProject/app/ordersManagement?ordersOp=order_insert",
										content : {
											instrumentId : dijit.byId( "instrumentsGrid").selection.getSelected( )[0].id[0],
											startSlot : dijit.byId( "selectStartSlot").value,
											slotsCount: dijit.byId( "selectSlotsCount").value,
											date : dijit.byId( "selectDate").toString( ),
											projectName : dijit.byId( "selectProject").value
										},
										load : function( data, ioArgs) {
											console.log( "Load");
											if ( data == "ERROR") {
												console.log( "Error");
												dijit.byId( "toaster")
													.setContent( "Backend error inserting/updating order. Please try later.", "fatal");
												dijit.byId( "toaster").show( );
												return;
											}
											dijit.byId( "instrumentOrdersGrid").store.newItem( eval(data));
											if ( dijit.byId( "userOrdersList"))
												dijit.byId( "userOrdersList").refresh( );
											dijit.byId( "orderDialog").destroyRecursive( );
										},
										error : function( ) {
											dijit.byId( "toaster")
												.setContent( "Backend error. Please check log files.", "fatal");
										}
									}); 
								</script>
							</button>
						</td>
					</tr>
				</table>
			</fieldset>
		</form>
	</body>
</html>